
		<style type="text/css">
			* {
				margin: 0;
				padding: 0;
			}
			a {
				text-decoration: none;
			}
			ul {
				list-style: none;
			}
			.tail2{
				width: 209px;
			}
			#FootCenter .a,#FootCenter a,#FootCenter h3,#FootCenter p{
				color: #898c91;
			}
			
			#FootCenter img{
				width: 28px;
				height: 28px;
				float: left;
				position: relative;
				top: 4px;
				left: 3px;
			}
			#FootNav{
				height: 43px;
				border-bottom: 1px solid #424242;
			}
			#FootNav li{
				display: inline-block;
				height: 43px;
				padding: 0 5px;
				cursor: pointer;
				font-size: 14px;
				line-height: 43px;
				position: relative;
				top: -8px;
				color: #9C9C9C;
			}
			
			#FootNav li:hover{
				color: #444444;
			}
			#FootNav li:nth-child(1){
				border-bottom: 2px solid #222222;
				font-weight: bold;
				color: #666666;
			}
			
			#FootCenter ul li{
				margin: 7px 0 3px;
				height: 43px;
			}
			#FootCenter ul li span{
				float: right;
				width: 165px;
			}
			#FootCenter ul li h3{
				font-size: 12px;
			}
			#FootCenter ul li p{
				font-size: 12px;
			}
			.nav4 a,#TNav4 a{
				height: 26px;
				color: #FFFFFF;
				font-size: 12px;
				padding: 5px;
				border: #666666 1px solid;
				position: relative;
				top: 3px;
			}
			
			/* 隐藏分栏 */
			#FootCenter .nav1{
				display: none;
			}
			#FootCenter #Nav1{
				display: block;
			}
		</style>



		<div id="FootCenter" class="tail2">
			<div id="FootNav">
				<ul>
					<li class="selected">热门</li>
					<li>最近</li>
					<li>评论</li>
					<li>标签</li>
				</ul>
			</div>
			<!-- 导航1（热门） -->
			<ul id="Nav1"  class="nav1">
				<li>
					<a href="#">
						<img src="./img/a1.jpg">
						<span>
							<h3>泰勒 Taylor Gig BK 吉他包 黑色</h3>
							<p>2015年7月16日 - 下午3:28</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a2.jpg">
						<span>
							<h3>泰勒 Taylor 214ce DLX 电箱民谣吉他</h3>
							<p>2016年1月11日 - 上午1:28</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a3.jpg">
						<span>
							<h3>泰勒 Taylor GS Mini American Girl®</h3>
							<p>2017年8月7日 - 下午7:45</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a4.jpg">
						<span>
							<h3>泰勒 Taylor GS Mini 琴包</h3>
							<p>2015年7月16日 - 下午3:28</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a5.jpg">
						<span>
							<h3>泰勒 Taylor 510e 电箱民谣吉他</h3>
							<p>2015年10月4日 - 上午11:12</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a6.jpg">
						<span>
							<h3>泰勒 Taylor 214ce-K 电箱民谣吉他</h3>
							<p>2015年9月12日 - 下午12:16</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a7.jpg">
						<span>
							<h3>泰勒 Taylor 214ce-N 古典吉他</h3>
							<p>2015年9月12日 - 下午12:25</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/a8.jpg">
						<span>
							<h3>泰勒 Taylor Baby bt1 民谣吉他</h3>
							<p>2015年8月14日 - 下午1:35</p>
						</span>
					</a>
				</li>
			</ul>
			
			<!-- 导航2（最近） -->
			<ul class="nav1">
				<li>
					<a href="#">
						<img src="./img/b1.png">
						<span>
							<h3>泰勒 Taylor 224CE-K DLX 电箱民谣吉他</h3>
							<p>2019年4月4日 - 下午2:15</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b2.png">
						<span>
							<h3>泰勒 Taylor Academy A12E-N 电箱古典吉他</h3>
							<p>2019年4月1日 - 上午12:44</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b3.png">
						<span>
							<h3>泰勒 Taylor Academy  A12 A12E 民谣吉他</h3>
							<p>2018年10月6日 - 下午3:39</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b4.png">
						<span>	
							<h3>泰勒 Taylor Academy  A10 A10E 民谣吉他</h3>
							<p>2018年10月6日 - 下午3:38</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b5.jpg">
						<span>
							<h3>泰勒 Taylor GS Mini American Girl®</h3>
							<p>2017年8月7日 - 下午7:45</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b6.png">
						<span>
							<h3>泰勒 Taylor GS Mini-e Bass 电箱民谣吉他</h3>
							<p>2017年4月17日 - 下午12:06</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b7.png">
						<span>
							<h3>泰勒 Taylor 916ce 缺角电箱民谣吉他</h3>
							<p>2017年4月11日 - 下午5:37</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/b8.png">
						<span>
							<h3>泰勒 Taylor 816ce 缺角电箱民谣吉他</h3>
							<p>2016年7月9日 - 上午10:32</p>
						</span>
					</a>
				</li>
			</ul>
			
			<!-- 导航3（评论） -->
			<ul class="nav1">
				<li>
					<a href="#">
						<img src="./img/avatar_256x256.png">
						<span>
							<h3>为什么没有左手吉他???  很难受😫</h3>
							<p>2021年4月11日 - 下午10:34 通过： Nick</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/avatar_256x256.png">
						<span>
							<h3>有没有左手琴</h3>
							<p>为什么没有左手吉他???  很难受😫</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/avatar_256x256.png">
						<span>
							<h3>你好，我新买了一把泰勒琴，因为之前早�...</h3>
							<p>2020年2月28日 - 下午5:27 通过： paul</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/avatar_256x256.png">
						<span>	
							<h3>全单的琴就是不一样，手感很棒，音色无�...</h3>
							<p>2020年1月3日 - 下午3:16 通过： 安琪拉弹吉他</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/avatar_256x256.png">
						<span>
							<h3>超乎想象的一把琴。</h3>
							<p>2019年12月22日 - 下午8:39 通过： 13326547</p>
						</span>
					</a>
				</li>
				<li>
					<a href="#">
						<img src="./img/avatar_256x256.png">
						<span>
							<h3>做工挺好的，估计应该没什么问题，</h3>
							<p>2019年12月22日 - 下午3:00 通过： 饼饼大魔王</p>
						</span>
					</a>
				</li>
			</ul>
			
			<!-- 导航4（标签） -->
			<div class="nav1" id="TNav4">
				<a href="#">Taylor</a>
				<a href="#">吉他</a>
				<a href="#">吉他包</a>
				<a href="#">泰勒</a>
				<a href="#">电箱吉他</a>
			</div>
		</div>



<script src="js/jQuery.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
	//尾部通用栏
	//尾部中间导航点击切换内容
	$(function() {
		//获取点击时间的对象
		$("#FootNav ul li").click(function() {
			//获取想要显示或者隐藏的对象
			var divShow = $("#FootCenter").children(".nav1");
			//判断当前对象是否被选中，如果没选中的话进入if循环
			if(!$(this).hasClass('selected')){
				//获取当前对象的索引
				var index = $(this).index();
				//当前对象添加选中样式并且其同胞移除选中样式；
				$(this).addClass('selected').siblings('li').removeClass('selected');
				//索引对应的div块显示
				$(divShow[index]).show();
				//索引对应的div块的同胞隐藏
				$(divShow[index]).siblings('.nav1').hide();
			}
			
			$(this).css({
				fontWeight: "bold",
				color: "#222222",
				borderBottom: "2px solid #666666"
			})
			$(this).siblings().css({
				fontWeight: "normal",
				color: "#9c9c9c",
				borderBottom: "0"
			})
		})
	})
</script>